
import styles from './index.css';
import { Deck, Slide, Heading, List, ListItem, BlockQuote, Cite, Text, Image } from 'spectacle'
import Dog from '@assets/imgs/dog.jpg'

export default function() {
  return (
    <Deck>
      <Slide><Heading>Mercury</Heading></Slide>
      <Slide><Heading>Venus</Heading></Slide>
      <Slide>
        <Heading>Earth</Heading>
        <Text>The wellknown blue planet in the solar system.</Text>
      </Slide>
      <Slide><Heading>Mars</Heading></Slide>
      <Slide>
        <Heading>Jupiter</Heading>
        <List>
          <ListItem>Io</ListItem>
          <ListItem>Europa</ListItem>
          <ListItem>Ganymede</ListItem>
          <ListItem>Callisto</ListItem>
          <ListItem>Amalthea</ListItem>
        </List>
      </Slide>
      <Slide><Heading>Saturn</Heading></Slide>
      <Slide>
        <Heading size={3}>Moon</Heading>
        <BlockQuote>
          <BlockQuote>BlockQuote: The BlockQuote</BlockQuote>
          <Cite>Cite: Author</Cite>
        </BlockQuote>
      </Slide>
      <Slide>
        <Heading>The Dog</Heading>
        <Image src={Dog} width='300' />
      </Slide>
    </Deck>
  );
}
